<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>妈的言击术</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <link rel="stylesheet" href="./fullPage/css/jquery.fullPage.css">
    <link rel="stylesheet" href="css/made.css">
    <!-- 规避防盗(音频那些) -->
    <meta name="referrer" content="never">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_633508_r0c0watl89vk7qfr.css">
</head>
<body>
    <!-- 背景音乐按钮 -->
    <div class="bgmbtn rotate">
        <audio src="http://res1.eqh5.com/69271cb923994ab58e650f63ab4c0499.mp3" loop autoplay preload id="bgm"></audio>

    </div>

<div id="web">
    <!-- 第一页 -->
        <div class="fp-section page_c page1 ">
            <div class="border">
                <img src="./img/bg_white3.png" alt="">
            </div>
            <div class="mon_beiying">
                <img src="./img/mon_beiying.png" alt="" class="mon_beiying_shake">

                <img src="./img/mon_beiying.png" alt="" class="mon_fangfa1">
                <img src="./img/mon_beiying.png" alt="" class="mon_fangfa2">
                <img src="./img/mon_beiying.png" alt="" class="mon_fangfa3">

                <img src="./img/mon_beiying.png" alt="" class="mon_left_go1">
                <img src="./img/mon_beiying.png" alt="" class="mon_left_go2">
                <img src="./img/mon_beiying.png" alt="" class="mon_left_go3">
                <img src="./img/mon_beiying.png" alt="" class="mom_right_go1">
                <img src="./img/mon_beiying.png" alt="" class="mom_right_go2">
                <img src="./img/mon_beiying.png" alt="" class="mom_right_go3">
                <img src="./img/mon_beiying.png" alt="" class="mom_right_go4">

                <img src="./img/mon_beiying.png" alt="" class="mon_fangfa4">
                <img src="./img/mon_beiying.png" alt="" class="mon_fangfa5">

            </div>
            <div class="page1_title">
                <img src="./img/madeyanjishu.png" alt="">
            </div>
            <div class="page1_circular page1_circular1">
                <p>吐槽</p>
            </div>
            <div class="page1_circular page1_circular2">
                <p>嘲讽</p>
            </div>
            <div class="page1_circular page1_circular3">
                <p>说教</p>
            </div>
            <div class="page1_circular page1_circular4">
                <p>人身攻击</p>
            </div>
            <div class="page1_word">
                <p>妈妈用她修炼几十年的“言击术”</p>
                <p>打得我们没有还手之力</p>
            </div>
        </div>

        <!-- 第二页 -->
        <div class="fp-section page_c page2">
            <div class="page2_border">
                <img src="./img/bg_white.png" alt="">
            </div>
            <div class="page2_mon_gongji">
                <img src="./img/mun_gongji2.png" alt="">
            </div>
            <div class="page2_aDa">
                <img src="./img/aDa.png" alt="">
            </div>
            <div class="page2_me">
                <img src="./img/me_beida.png" alt="">
            </div>
            <div class="page2_phone">
                <img src="./img/phone.png" alt="">
            </div>
            <div class="page2_title">
                <img src="./img/huijiakanshouji2.png" alt="">
            </div>
            <div class="page2_blood">
                <img src="./img/blood.png" alt="">
            </div>
            <div class="page2_word">
                <p>第一式——看你安静的呆着就是不顺眼</p>
            </div>
        </div>

        <!-- 第三页 -->
        <div class="fp-section page_c page3">
            <div class="page3_border">
                <img src="./img/bg_white2.png" alt="">
            </div>
            <div class="page3_me">
                <img src="./img/me_pa.png" alt="">
            </div>
            <div class="page3_han">
                <img src="./img/han.png" alt="">
            </div>
            <div class="page3_shadow">
                <img src="./img/yingzi3.png" alt="">
            </div>
            <div class="page3_mon_gongji">
                <img src="./img/mama_quan.png" alt="">
            </div>
            <div class="page3_title">
                <img src="./img/lianbuda2.png" alt="">
            </div>
            <div class="page3_guangquan">
                <img src="./img/guangquan.png" alt="">
            </div>
            <div class="page3_flashing">
                <img src="./img/Flashthree.png" alt="">
            </div>
            <div class="page3_word">
                <p>第二式——在妈眼里你永远吃不饱</p>
            </div>
        </div>

        <!-- 第四页 -->
        <div class="fp-section page_c page4">
            <div class="page4_border">
                <img src="./img/duihuakuang2.png" alt="">
            </div>
            <div class="page4_mon_gongji">
                <img src="./img/mum_gongji3.png" alt="">
            </div>
            <div class="BAoo">
                <img src="./img/BAOO.png" alt="">
            </div>
            <div class="page4_me">
                <img src="./img/me_beidafei2.png" alt="">
            </div>
            <div class="page4_me_gost">
                <img src="./img/feiren_touming.png" alt="">
            </div>
            <div class="page4_mon_shadow">
                <img src="./img/yingzi1.png" alt="">
            </div>
            <div class="page4_me_shadow">
                <img src="./img/yingzi2.png" alt="">
            </div>
            <div class="page4_title">
                <img src="./img/nikankanrenjia.png" alt="">
            </div>
            <div class="page4_word">
                <p>第三式——这招借刀杀人叫做“别人家的孩子”</p>
            </div>
        </div>

        <!-- 第五页 -->
        <div class="fp-section page_c page5">
            <div class="page5_border">
                <img src="./img/duihuakuang3.png" alt="">
            </div>
            <div class="page5_blood">
                <img src="./img/blood2.png" alt="">
            </div>
            <div class="page5_mon_gongji">
                <img src="./img/mum_gongji.png" alt="">
            </div>
            <div class="bakoko">
                <img src="./img/bakoko.png" alt="">
            </div>
            <div class="page5_guangquan">
                <img src="./img/guangquan2.png" alt="">
            </div>
            <div class="page5_guangquan2">
                <img src="./img/guangquan3.png" alt="">
            </div>
            <div class="page5_me">
                <img src="./img/me_dafei.png" alt="">
            </div>
            <div class="me_shake">
                <img src="./img/me_dafei.png" alt="">
            </div>
            <div class="page5_title">
                <img src="./img/boyfriend.png" alt="">
            </div>
            <div class="page5_word">
                <p>第四式——不去找对象和一条咸鱼有什么分别</p>
            </div>
        </div>

        <!-- 第六页 -->
        <div class="fp-section page_c page6">
            <div class="page6_border">
                <img src="./img/duihuakuang_big.png" alt="">
            </div>
            <div class="page6_guangquan">
                <img src="./img/guangquan4.png" alt="">
            </div>
            <div class="wind">
                <img src="./img/dishangfeng.png" alt="">
            </div>
            <div class="windShake page6_Shake">
                <img src="./img/dishangfeng.png" alt="">
            </div>
            <div class="page6_mon_gongji">
                <img src="./img/mum_gongji4.png" alt="">
            </div>
            <div class="page6_mon_Shake page6_Shake">
                <img src="./img/mum_gongji4.png" alt="">
            </div>
            <div class="boom">
                <img src="./img/boom.png" alt="">
            </div>
            <div class="page6_title">
                <img src="./img/wozenmeshengleni.png" alt="">
            </div>
            <div class="page6_star">
                <img src="./img/star.png" alt="">
            </div>
            <div class="page6_blackstar">
                <img src="./img/star2.png" alt="">
            </div>
            <div class="mon_talk">
                <p>妈妈~</p>
            </div>
            <div class="page6_word">
                <p>究极式——你自己看吧，说的很明白了</p>
            </div>
        </div>

        <!-- 第七页 -->
        <div class="fp-section page_c page7">
            <div class="slide page7_one">
                <div class="page7_top"></div>
                <div class="page7_word">在老妈眼里我没救了...</div>
                <div class="page7_me"><img src="./img/me.png" alt=""></div>
                <div class="page7_btn ">
                    <img src="./img/shima.png" alt="">
                </div>
                <div class="page7_btn page7_btn2">
                    <img src="./img/shima.png" alt="">
                </div>
                <div class="page7_finger">
                    <img src="./img/left_finger.png" alt="">
                </div>
                <div class="page7_finger page7_finger2">
                    <img src="./img/left_finger.png" alt="">
                </div>
            </div>

            <!-- 第七页副页 -->
            <div class="slide page7_two">
                <div class="page7_border">
                    <img src="./img/duihuakuang4.png" alt="">
                </div>
                <div class="mon_friends">
                    <img src="./img/mum_beiying2.png" alt="">
                </div>
                <div class="page7_mom">
                    <img src="./img/mum.png" alt="">
                </div>
                <div class="mon_friends2 mon_and_friends">
                    <img src="./img/mum_beiying2.png" alt="">
                </div>
                <div class="page7_mom2 mon_and_friends">
                    <img src="./img/mum.png" alt="">
                </div>
                <div class="page7_mon_talk">
                    <p>是啊，我家孩子可好啦。要是假期结束也不走就更好了，真希望ta一直留在身边陪我！</p>
                </div>
                <div class="mon_friends_talk">
                    <p>你家孩子真懂事啊，我看这回回家又给你买了不少东西，还陪你买菜呢。</p>
                </div>
                <div class="page7_two_title">
                    <img src="./img/mamaloveus.png" alt="">
                </div>
                <div class="page7_two_title_light">
                    <img src="./img/yuandian.gif" alt="">
                </div>
                <div class="page7_boom">
                    <img src="./img/boom2.png" alt="">
                </div>
            </div>

        </div>

        <!-- 第八页 -->
        <div class="fp-section page_c page8">
            <div class="page8_title">
                <img src="./img/word1.png" alt="">
            </div>
            <div class="page8_middle">
                <a href="#">
                    <img src="./img/dianjizhizaozhufu.png" alt="">
                </a>
            </div>
            <div class="page8_me_left">
                <img src="./img/me_beidafei.png" alt="">
            </div>
            <div class="page8_me_right">
                <img src="./img/feiren.png" alt="">
            </div>
            <div class="page8_bottom">
                <p>（下页的投票不容错过！）</p>
            </div>
        </div>

        <!-- 第九页 -->
        <div class="fp-section page_c page9">
            <div class="page9_box">
                    <div class="page9_box_top">
                        <img src="./img/huijiakanshouji.png" alt="">
                    </div>
                    <div class="page9_box_bottom">
                        <i class="iconfont icon-dianzan_active"></i>
                        <span>1682</span>
                    </div>
                </div>
            <div class="page9_box">
                    <div class="page9_box_top">
                        <img src="./img/boyfriend2.png" alt="">
                    </div>
                    <div class="page9_box_bottom">
                        <i class="iconfont icon-dianzan_active"></i>
                        <span>1196</span>
                    </div>
                </div>
            <div class="page9_box">
                    <div class="page9_box_top">
                        <img src="./img/nikankanrenjia2.png" alt="">
                    </div>
                    <div class="page9_box_bottom">
                        <i class="iconfont icon-dianzan_active"></i>
                        <span>1466</span>
                    </div>
                </div>
            <div class="page9_box">
                    <div class="page9_box_top">
                        <img src="./img/lianbuda.png" alt="">
                    </div>
                    <div class="page9_box_bottom">
                        <i class="iconfont icon-dianzan_active"></i>
                        <span>1468</span>
                    </div>
                </div>
            <div class="page9_box">
                    <div class="page9_box_top">
                        <img src="./img/wozenmeshengleni2.png" alt="">
                    </div>
                    <div class="page9_box_bottom">
                        <i class="iconfont icon-dianzan_active"></i>
                        <span>1084</span>
                    </div>
                </div>
            <div class="page9_border">
                <img src="./img/nine_bg2.png" alt="">
            </div>
            <div class="page9_mon">
                <img src="./img/mum2.png" alt="">
            </div>
            <div class="page9_arrow">
                <img src="./img/nine_arrow.png" alt="">
            </div>
            <div class="page9_mon_talk">
                <p>你中了几招？</p>
            </div>

        </div>

        <!-- 第十页 -->
        <div class="fp-section page_c page10">
            <div class="page10_title">
                <p>妈的言击术</p>
            </div>
            <div class="page10_img">
                <img src="./img/bg_index2.jpg" alt="">
            </div>
            <div class="page10_word">
                <p><a href="#">点我免费制作易企秀</a></p>
            </div>
            <div class="page10_report">
                <a href="#">举报</a>
            </div>
        </div>
</div>




    <!-- 引入js 注意依赖关系 -->
    <script src="./fullPage/js/jquery-1.8.3.min.js"></script>
    <script src="./fullPage/js/jquery.fullPage.js"></script>

    <!-- fullpage 初始化 -->
    <script>
        $("#web").fullpage({
            controlArrows:false,
            continuousVertical : true,
            afterRender:function () {
                $(".fp-section").eq(0).addClass("doIt");
            },
            onLeave:function(index, nextIndex, direction){
                $(".fp-section").eq(index - 1).toggleClass("doIt");
            },
            afterLoad:function (anchorIndex,index) {
                $(".fp-section").eq(index - 1).addClass("doIt");
            }
        });
        $(".page7_btn2").on("click", function(){
            $.fn.fullpage.moveSlideRight();
        });
        $(".bgmbtn").on("click", function () {
            $(".bgmbtn").toggleClass("rotate");
            playPause();
        });
        var bgm = $("#bgm");
        function playPause(){
            if(bgm[0].paused){
                bgm[0].play();
            }else{
                bgm[0].pause();
            }
        }
    </script>
</body>
</html>